<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script th:src="@{/miniui/jquery.min.js}" type="text/javascript"></script>
    <script th:src="@{/miniui/scripts/boot.js}"></script>
</head>
<body>

<h1>数据验证</h1>


<div id="form1">
    <table>
        <tr>
            <td><label for="username$text">帐号：</label></td>
            <td>
                <input name="username" vtype="email" class="mini-textbox" required="true" requiredErrorText="帐号不能为空"/>

            </td>
        </tr>
        <tr>
            <td><label for="pwd$text">密码：</label></td>
            <td>
                <input name="pwd" class="mini-password" vtype="minLength:5" required="true" minLengthErrorText="密码不能少于5个字符" />

            </td>
        </tr>
        <tr>
            <td></td>
            <td>
                <input value="Login" type="button" onclick="submitForm()" />
            </td>
        </tr>
    </table>
</div>

</body>
</html>


<script type="text/javascript">
    mini.parse();

    function submitForm() {

        var form = new mini.Form("#form1");

        form.validate();
        if (form.isValid() == false) return;

        //提交数据
        var data = form.getData();
        var json = mini.encode(data);
        alert("提交成功");
    }

</script>
